<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="/WEB-INF/tld/pageutil.tld" prefix="pu"%>
<%@taglib uri="/WEB-INF/tld/pageable.tld" prefix="pageable"%>
<%@taglib uri="http://java.sun.com/jstl/core" prefix="c"%>
<%@taglib uri="http://java.sun.com/jstl/core_rt" prefix="c-rt"%>
<%@taglib uri="http://java.sun.com/jstl/fmt_rt" prefix="fmt-rt"%>
<script>
function addColumn(){
	document.formForm.action="/ecadmin/form/addColumn.do";
	document.formForm.submit();
}
$(function(){
	$('#submitForm').click(function(){
		error="";
		if(document.formForm.formName.value==''){
			error+="表单名称为必填\r\n";
		}
		if(document.formForm.formDescription.value==''){
			error+="表单描述为必填\r\n";
		}
		var noColumnName=false;
		$('.columnName').each(function(){
			if($(this).attr('value')==''){
				noColumnName=true;
			}
		});
		if(noColumnName){
			error+="栏位名称为必填\r\n";
		}
		if(error!=''){
			alert(error);
		}else{
			document.formForm.submit();
		}
	});
	$('#resetForm').click(function(){
		location.href='/ecadmin/form/getForm.do?formName=${formName}';
	});
	$('#createForm').click(function(){
		location.href="/ecadmin/form/list.do";
	});
	
});
</script>

<style>
<!--
.tb-2{border:1px solid #ccc; width:100%; vertical-align:text-bottom;}
.tb-2 th{background:#ffe9b5; color:#631;text-align:center; font-weight:bold; font-size:13px; padding:.25em;*padding:.35em .2em .15em;vertical-align:middle}
.tb-2 td{padding:6px 5px;*padding:6px 5px 4px;text-align:center;}

.tb-2 td {
text-align:left;
}
.tb-2 tr:hover{background:#fffae5;}
-->
</style>
<h1>表单管理

</h1>
${message }
<table class="tb-2">
<tr><td align="left"><input type="button" value="建立表单" id="createForm"/></td></tr>
</table>
<br/>
<table>
<tr>
<td valign="top">
<form name="selectForm" method="get" action="/ecadmin/form/getForm.do">
<select name="formName"  multiple="multiple" size="35" onchange="document.selectForm.submit()">
<c-rt:forEach items="${forms }" var="aForm">
<option value="${aForm.name }" <c-rt:if test="${param.formName==aForm.name }">selected="selected"</c-rt:if>>${aForm.description }</option>
</c-rt:forEach>
</select>
</form>
</td><td valign="top">
<form name="formForm" method="post" action="/ecadmin/form/update.do">
	<table class="tb-2">
	<tr>
	<td valign="top">
		<table>
			<tr><th>名称</th><td>
			<c-rt:if test="${!empty formName}">
			<input type="hidden" name="formName" value="${formName }"/>${formName }
			</c-rt:if>
			<c-rt:if test="${empty formName}">
			<input type="text" name="formName" value="${formName }"/>
			</c-rt:if>
			
			</td></tr>
			<tr><th>描述</th><td><input type="text" name="formDescription" value="${formDescription }"/></td></tr>

		</table>
	</td>
	</tr>
	<tr>
	<td>
		<table class="tb-2" id="theTable">
				<tr>
					<th></th>
					<th>id</th>
					<th>名称</th>
					<th>描述</th>
					<th>资料型态</th>
					<th>是否必填</th>
					<th>其他</th>
					
					
				</tr>
				${pu:reqSet('columnCount', 0) }
			<c-rt:forEach items="${id }" var="attribute" varStatus="status">
				${pu:reqSet('columnCount', status.count) }
				<tr id="tr_${status.index }">
					<td><input type="button" id="remove_${status.index }" onclick="$('#tr_${status.index}').remove()" value="移除"/></td>
					<td valign="top"><input type="text" name="id" value="${id[status.index] }" readonly="readonly" size="10"/>
					<script>columnAt++;</script>
					</td>
					<td valign="top"><input type="text" name="name" value="${name[status.index] }" size="8"/></td>
					<td valign="top"><input type="text" name="description" value="${description[status.index] }" size="8"/></td>
					<td valign="top"><input type="text" name="dataType" value="${dataType[status.index] }" size="8"/></td>
					<td valign="top"><input type="text" name="mandatory" value="${mandatory[status.index] }" size="4"/></td>
					<th>
					<a href="#" id="close_${status.index }" onclick="$('#open_${status.index}').show();$('#column_${status.index}').hide();$('#close_${status.index}').hide();" style="display:none">收合</a>
					<a href="#" id="open_${status.index }" onclick="$('#column_${status.index}').show();$('#close_${status.index}').show();$('#open_${status.index}').hide()">打开</a>
					<table id="column_${status.index }" style="display:none">
					<tr>
					<th>最大长度</th><td><input type="text" name="maxLength" value="${maxLength[status.index] }"/></td>
					</tr>
					<tr>
					<th>最小长度</th><td><input type="text" name="minLength" value="${minLength[status.index] }"/></td>
					</tr>
					<tr>
					<th>最大值</th><td><input type="text" name="maxValue" value="${maxValue[status.index] }"/></td>
					</tr>
					<tr>
					<th>最小值</th><td><input type="text" name="minValue" value="${minValue[status.index] }"/></td>
					</tr>
					<tr>
					<th>提示</th><td><input type="text" name="tip" value="${tip[status.index] }"/></td>
					</tr>
					<tr>
					<th>预设值</th><td><input type="text" name="defaultValue" value="${defaultValue[status.index] }"/></td>
					</tr>
					<tr>
					<th>显示群名(,分隔)</th><td><input type="text" name="presentNames" value="${presentNames[status.index] }"/></td>
					</tr>
					<tr>
					<th>显示群值(,分隔)</th><td><input type="text" name="presentValues" value="${presentValues[status.index] }"/></td>
					</tr>
					<tr>
					<th>日期格式</th><td><input type="text" name="dateFormat" value="${dateFormat[status.index] }"/></td>
					</tr>
					<tr>
					<th>componentUrl</th><td><input type="text" name="componentUrl" value="${componentUrl[status.index] }"/></td>
					</tr>
					<tr>
					<th>排序</th><td><input type="text" name="sortOrder" value="${(sortOrder[status.index]!=null && sortOrder[status.index]!='null')?sortOrder[status.index]:'' }"/></td>
					</tr>
					
					</table>
					</th>
					
				</tr>
			</c-rt:forEach>
			<c-rt:if test="${method=='addColumn'}">
			<tr id="tr_${columnCount }">
			<td><input type="button" id="remove_${columnCount }" onclick="$('#tr_${columnCount}').remove()" value="移除"/></td>
					<td valign="top"><input type="text" name="id" readonly="readonly" size="10"/>
					</td>
					<td valign="top"><input type="text" class="columnName" name="name" size="8"/></td>
					<td valign="top"><input type="text" name="description" size="8"/></td>
					<td valign="top"><input type="text" name="dataType" size="8"/></td>
					<td valign="top"><input type="text" name="mandatory" size="4"/></td>
					<th>
					<a href="#" id="close_${columnCount }" onclick="$('#open_${columnCount }').show();$('#column_${columnCount }').hide();$('#close_${columnCount }').hide();" style="display:none">收合</a>
					<a href="#" id="open_${columnCount }" onclick="$('#column_${columnCount }').show();$('#close_${columnCount }').show();$('#open_${columnCount }').hide();">打开</a>
					<table id="column_${columnCount }" style="display:none">
					<tr>
					<th>最大长度</th><td><input type="text" name="maxLength" value="-1"/></td>
					</tr>
					<tr>
					<th>最小长度</th><td><input type="text" name="minLength" value="-1"/></td>
					</tr>
					<tr>
					<th>最大值</th><td><input type="text" name="maxValue" value="-1"/></td>
					</tr>
					<tr>
					<th>最小值</th><td><input type="text" name="minValue" value="-1"/></td>
					</tr>
					<tr>
					<th>提示</th><td><input type="text" name="tip"/></td>
					</tr>
					<tr>
					<th>预设值</th><td><input type="text" name="defaultValue"/></td>
					</tr>
					<tr>
					<th>显示群名(,分隔)</th><td><input type="text" name="presentNames"/></td>
					</tr>
					<tr>
					<th>显示群值(,分隔)</th><td><input type="text" name="presentValues"/></td>
					</tr>
					<tr>
					<th>日期格式</th><td><input type="text" name="dateFormat" value="yyyy/MM/dd HH:mm:ss"/></td>
					</tr>
					<tr>
					<th>componentUrl</th><td><input type="text" name="componentUrl"/></td>
					</tr>
					<tr>
					<th>排序</th><td><input type="text" name="sortOrder"/></td>
					</tr>
					
					</table>
					</th>
					
				</tr>
			</c-rt:if>
		</table>
	</td>
	</tr>
	</table>
	<br/>
	<input type="button" value="新增栏位" onclick="addColumn()"/>
	<br/>
	<table class="tb-2">
	<tr><td align="left"><input type="button" id="submitForm" value="送出"/><input type="button" id="resetForm" value="重置"/></td></tr>
	</table>
	</form>
</td>
</tr>
</table>
<table style="display:none">
<tbody id="tempTr">

</tbody>
</table>